<template>
  <div class="com-box">
    <div class="common-title">
      入院前宣教
    </div>
    <div class="flex justify-end">
      <el-button size="primary" @click="goExport()" style="width:100px;">导出</el-button>
    </div>
    <div class="html-box">
      <div v-html="state.html"></div>
    </div>

    <div v-if="props.datas.preoperativeEducation" class="sign-box flex " >
      <div class="sign-item" style="margin-right:20px;">
        <div class="tag">患方签字</div>
        <img :src="props.datas.preoperativeEducation.patientSign" alt=""/>
        <div class="time">日期: {{ props.datas.preoperativeEducation.patientSignAt }}</div>
      </div>
      <div class="sign-item">
        <div class="tag">医方签字</div>
        <img :src="props.datas.preoperativeEducation.doctorSign" alt=""/>
        <div class="time">日期: {{ props.datas.preoperativeEducation.doctorSignAt }}</div>
      </div>
    </div>

  </div>
</template>

<script setup name="beforeEdu">
import { getHost } from "/@/utils/getHost";
import { Session } from '/@/utils/storage';

const props = defineProps({
  datas: {
    type: Object,
    default: () => { },
  },
});

const state = reactive({
  html:'<p style="text-align: center;"><span style="color: rgb(0, 0, 0); font-size: 22px;"><strong>深圳市人民医院日间手术告知书 </strong></span></p><br><br><p><span style="color: rgb(0, 0, 0);">尊敬的患者及家属： </span></p><p><span style="color: rgb(0, 0, 0);">日间手术是指患者入院、手术和出院在一个工作日内完成的手术，住院总时间不超过24小时。您将于<span class="time"></span> 入日间手术病房行相关手术。为手术顺利进行，请您配合做好 以下事项： </span></p><p><br></p><p><span style="color: rgb(0, 0, 0);"><strong>预住院：</strong></span><span style="color: rgb(0, 0, 0);"> </span></p><p><span style="color: rgb(0, 0, 0);">我院日间手术按照预住院流程管理，方便患者完善术前检验检查，不等同于正式住院。如另需就诊，请去医院门、急诊。 </span></p><p><span style="color: rgb(0, 0, 0);">完成医生开具的术前检查：如血液检验、心电图、胸片、CT、彩超等，结果交给护士。 </span></p><p><span style="color: rgb(0, 0, 0);">完成术前麻醉评估：患者需持心电图去评估。（挂号：门诊麻醉科，地点：1栋4楼44-47诊室） </span></p><p><span style="color: rgb(0, 0, 0);">如需复印病历，请携带患者身份证及办理人身份证去病案室。（地点：本院7栋1楼) </span></p><p><span style="color: rgb(0, 0, 0);">如需改期或取消手术，请提前两日致电日间手术中心工作人员。 由于个人原因取消手术，需签署《拒绝或放弃医学治疗告知书》，预住院期间产生的医疗费用不能纳入住院医保，需自费处理。 </span></p><p><br></p><p><span style="color: rgb(0, 0, 0);"><strong>手术前一天：</strong></span></p><p><span style="color: rgb(0, 0, 0);">晚餐半流饮食，勿食活血化瘀的食物、补品。22点后禁食、24点后禁饮；局麻除外。 </span></p><p><span style="color: rgb(0, 0, 0);">清洁个人卫生,修剪指（趾）甲、洗澡、洗头等，手术区域自行备皮；晚上保证充足的睡眠。</span></p><p><span style="color: rgb(0, 0, 0);">病房只提供一个暖水瓶，生活用品请酌情携带，轻便着装，请勿携带贵重物品。 </span></p><p><span style="color: rgb(0, 0, 0);">如果手术时间有变动，术前一个工作日17:00左右，护士会致电并告知患者，请保持电话通畅。</span></p><p><br></p><p><span style="color: rgb(0, 0, 0);"><strong>手术当日：</strong></span><span style="color: rgb(0, 0, 0);"> </span></p><p><span style="color: rgb(0, 0, 0);">手术当日未按规定入院时间到达医院，影响手术如期进行，则取消手术，按医院相关规定处理。 </span></p><p><span style="color: rgb(0, 0, 0);">局麻患者，术晨可进易消化饮食，切勿有饱胀感。除局麻患者外，均需禁食、禁饮，如有特殊情况请告知麻醉医生和手术医生。 </span></p><p><span style="color: rgb(0, 0, 0);">请将您的首饰、发夹、眼镜（包括隐形眼镜)、假牙等物品取下，不要化妆、涂指甲油，以免影响术中观察病情。 </span></p><p><span style="color: rgb(0, 0, 0);">高血压患者，术晨用少量的水（10ml）服下降血压药物。如有服用其他药物，请提前告知医生护士，以免影响手术。 </span></p><p><span style="color: rgb(0, 0, 0);">请携带所有检查资料，包括CT片、X片、外院检查项目等。 </span></p><p><br></p><p><span style="color: rgb(0, 0, 0);"><strong>出院后：</strong></span></p><p><span style="color: rgb(0, 0, 0);">24小时内，请务必有人陪护，并住在离医院较近的居所，保持电话通畅，不适随诊。 </span></p><p><span style="color: rgb(0, 0, 0);">工作日期间：如果您有任何不适,请联系日间手术病房，电话：22943080；22943083；18100282327。 </span></p><p><span style="color: rgb(0, 0, 0);">节假日期间：如果您有任何不适,请立即到急诊科就诊,并联系日间手术病房，电话：18100282327 。</span></p><p><span style="color: rgb(0, 0, 0);">以上条款医护人员已向患者及家属逐一解释，本须知一式二份，一份交患者，一份存档，具有相同效力。 </span></p><p><span style="color: rgb(0, 0, 0);">深圳市人民医院日间手术中心全体医务人员祝您早日康复！ 感谢您的配合！</span></p><p><br></p><p><br></p><p style="text-align: center;"><span style="color: rgb(0, 0, 0);"> </span></p><p style="text-align: center;"></p><p><br></p><p><br></p>'
})
const route = useRoute();

// 页面加载时
onMounted(() => {
  if(props.datas.preoperativeEducation && props.datas.preoperativeEducation.operationAt){
    const time = props.datas.preoperativeEducation.operationAt
    state.html = state.html.replace('<span class="time"></span>',time);
  }

});

const goExport = () => {
  const url =  getHost() + '/patient/export_preoperative_education' + '?prid=' + route.query.id + '&token=' + Session.get('token')
  const link = document.createElement('a')
  link.href = url
  link.setAttribute('download', '')
  document.body.appendChild(link)
  link.click()
  document.body.removeChild(link)
}

</script>

<style lang="scss" scoped>
h4{
  margin-top: 30px;
  margin-bottom: 10px;
}
.com-box {
  min-height: 620px;
}

.sign-box{
  margin-bottom: 20px;
}

.sign-item{
  position: relative;
  width: 300px;
  height: 100px;
  border-radius: 10px;
  border: 1px solid #409EFF;
  img{
    width: 100%;
    height: 100%;
    border-radius: 10px;
  }
  .tag{
    position: absolute;
    border-top-left-radius: 10px;
    border-bottom-right-radius: 10px;
    background-color: #409EFF;
    color: #fff;
    padding: 2px 5px;
    font-size: 13px;
    text-align: center;
  }
}
</style>
